<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<c:set var="path" value="${pageContext.request.contextPath}" />
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Document</title>
</head>
<link rel="stylesheet" type="text/css"
	href="${path }/static/css/clothes.css">
<body>
	<a href="${path }/ToIndexServlet?userid=${userid }"><div
			class="hdimg"></div></a>
	<div class=" Search">
		<input id="searchInput" class="search-input" type="text"
			placeholder="搜索其他喜欢的衣服">
		<button class="search-btn btn">搜索</button>
	</div>
	<div class="b1">
		<div class="b2">
			<img src="static/images/${c.image }.jpg" id="bigPic" />
			<div id="smallPic">
				<img src="static/images/${c.image }.jpg" class="" /> <img
					src="static/images/${c.image }-2.jpg" /> <img
					src="static/images/${c.image }-3.jpg" /> <img
					src="static/images/${c.image }-4.jpg" /> <img
					src="static/images/${c.image }-5.jpg" />
			</div>
		</div>
		<div class="b3">
			<div class="hd">
				<h1>${c.com_name }</h1>
				<p class="newp">休闲牛仔上衣</p>
			</div>
			<div>
				<dl class="dl1">
					<dt>价格&nbsp;:</dt>
					<dd>
						<em>￥</em> <span>${c.price } </span>
					</dd>
				</dl>
			</div>
			<div>
				<dl class="dl1">
					<dt>运费&nbsp;:</dt>
					<dd>
						<div class="dld">
							<a>上海&nbsp;&nbsp;-----&nbsp;&nbsp;10元</a>
						</div>
					</dd>
				</dl>
			</div>
			<ul>
				<li>
					<div class="dl2">
						<span>累计评价</span> <span>245</span>
					</div>
				</li>
				<li>
					<div class="dl1">
						<a href="##"> 积&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;分 349</a>
					</div>
				</li>
			</ul>
			<div>
				<div>
					<div class="dl2">
						<dl>
							<dt>尺码&nbsp;:</dt>
							<dd>
								<ul data-property="尺码">
									<select name="size">
										<option value="S">S</option>
										<option value="M">M</option>
										<option value="L">L</option>
									</select>
								</ul>
							</dd>
						</dl>
						<dl>
							<dt>颜色&nbsp;:</dt>
							<dd>
								<ul>
									<li title="靛青色"><a href="#" center="" no-repeat
										role="button" tabindex="0"> <span>靛青色</span>
									</a></li>
								</ul>
								<a href="#" center="" no-repeat role="button" tabindex="0">
								</a>
							</dd>
							<a href="#" center="" no-repeat role="button" tabindex="0"> </a>
						</dl>
						<a href="#" center="" no-repeat role="button" tabindex="0"> </a>
						<dl class="tb-amount tm-clear">
							<a>
								<dt class="tb-metatit">数量&nbsp;:</dt>
								<dd>
									<span> <input type="text" value="1" maxlength="8"
										title="请输入购买量" /> <span class="mui-amount-unit">件</span></span>
								</dd>
								<div class="sele">
									<div class="buy">
										<a href="#">立即购买</a>
									</div>
									<div class="buycar">
										<a
											href="${path }/DoAddShoppingCart?comid=${c.comid}&userid=${userid}">加入购物车</a>
									</div>
									<br /> <br /> <br />
									<div class="scj">
										<a
											href="${path }/DoAddFavorite?userid=${userid}&comid=${c.comid}">添加到收藏夹</a>
									</div>
								</div>
							</a>
						</dl>
					</div>
				</div>
			</div>
		</div>
	</div>
</body>
<script type="text/javascript">
	var smallPic = document.getElementById("smallPic");
	var imglist = document.getElementsByTagName("img");
	var bigPic = document.getElementById("bigPic");

	for (var i = 0; i < imglist.length; i++) {
		imglist[i].onmouseover = function() {
			for (var j = 0; j < imglist.length; j++) {
				imglist[j].style.border = "";
			}
			this.style.border = "2px solid black";
			bigPic.src = this.src;
		}
	}
</script>
</html>